<ng-template #progressInfoTemplate>
  <span class="ant-progress-text" *ngIf="nzShowInfo">
    <ng-container *ngIf="(nzStatus=='exception')||(nzStatus=='success')&&(!isFormatSet); else formatTemplate">
      <i class="anticon" [ngClass]="iconClassMap"></i>
    </ng-container>
    <ng-template #formatTemplate>
      {{ nzFormat(nzPercent) }}
    </ng-template>
  </span>
</ng-template>
<div [ngClass]="'ant-progress ant-progress-status-'+nzStatus"
  [class.ant-progress-line]="nzType=='line'"
  [class.ant-progress-small]="nzSize=='small'"
  [class.ant-progress-show-info]="nzShowInfo"
  [class.ant-progress-circle]="isCirCleStyle">
  <div *ngIf="nzType=='line'">
    <div class="ant-progress-outer">
      <div class="ant-progress-inner">
        <div class="ant-progress-bg" [style.width.%]="nzPercent" [style.height.px]="nzStrokeWidth"></div>
        <div class="ant-progress-success-bg" [style.width.%]="nzSuccessPercent" [style.height.px]="nzStrokeWidth"></div>
      </div>
    </div>
    <ng-template [ngTemplateOutlet]="progressInfoTemplate"></ng-template>
  </div>
  <div
    [style.width.px]="this.nzWidth"
    [style.height.px]="this.nzWidth"
    [style.fontSize.px]="this.nzWidth*0.15+6"
    class="ant-progress-inner"
    *ngIf="isCirCleStyle">
    <svg class="ant-progress-circle " viewBox="0 0 100 100">
      <path
        class="ant-progress-circle-trail"
        stroke="#f3f3f3"
        fill-opacity="0"
        [attr.stroke-width]="nzStrokeWidth"
        [ngStyle]="trailPathStyle"
        [attr.d]="pathString">
      </path>
      <path
        class="ant-progress-circle-path"
        [attr.d]="pathString"
        stroke-linecap="round"
        fill-opacity="0"
        [attr.stroke]="statusColorMap[nzStatus]"
        [attr.stroke-width]="nzPercent?nzStrokeWidth:0"
        [ngStyle]="strokePathStyle">
      </path>
    </svg>
    <ng-template [ngTemplateOutlet]="progressInfoTemplate"></ng-template>
  </div>
</div>